<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>进度条</title>
     <!--引入2 css-->
         <link rel="stylesheet" href="../themes/default/easyui.css" type="text/css"/>
         <link rel="stylesheet" href="../themes/icon.css" type="text/css"/>
         <!--引入js文件-->
         <script type="text/javascript" src="../js/jquery.min.js"></script>
         <script type="text/javascript" src="../js/jquery.easyui.min.js"></script>
</head>
<body>
<div id="p" class="easyui-progressbar" data-options="value:60" style="width:400px;"></div>

<hr>
<!--动态创建-->
<div id="progressBar" style="width:400px;"></div>

<input id="startID" type="button" value="动起来" style="width:111px;height:111px;font-size:33px"/>
<script type="text/javascript">
    var prog=$("#progressBar");
    prog.progressbar({
    value:20
});

    //函数
    function update(){
     prog.progressbar('setValue',100);
    }

    $("#startID").click(function () {
        update();
    });



</script>
</body>
</html>